<template>
  <div class="container">
      <h2 class="handle-title">系统管理 > 权限分配</h2>
      <el-tree
        :data="navData"
        show-checkbox
        node-key="id"
        :default-expanded-keys="expandedKeys"
        :default-checked-keys="checkedKeys"
        :props="defaultProps"
        @check="handleCheck">
      </el-tree>
      <el-button class="query_btn" type="primary" @click="goSubmit" :disabled="disabled">提交</el-button>
      <el-button class="query_btn" type="primary" @click="goBack">取消</el-button>
  </div>
</template>

<script>
import { getRight } from "../../api/public/api";
import { saveRight } from "../../api/public/api";
export default {
  name: '',
  data() { 
    return {
        navData: [], //获取的数据
        defaultProps: {
          children: 'children',
          label: 'label'
        },
        expandedKeys:[], //默认打开的项
        checkedKeys:[], //默认选中的项
        submitData:[], //需要提交的数据
        roleid:"",//保存用户id
        disabled:true //初始修改状态
    }
  },
  mounted() {
    let that = this;
    let id = this.$route.query.id;
    this.roleid = id;
    //根据ID初始化角色权限分配
    getRight(id).then((res)=>{
        let navData = res.data.datalist
        //console.log(navData)
        //处理数据格式
        let arr = [];
        for(var i =0;i<navData.length;i++){
          if(navData[i].funpid == -1){
            arr.push({
              id:navData[i].funid,
              label:navData[i].funname,
              children:[]
            })
          }
          this.expandedKeys.push(navData[i].funid)
          if(navData[i].rrid != null){
            //console.log(navData[i])
            this.checkedKeys.push(navData[i].funid)
          }
        }
        for(var j=0;j<navData.length;j++){
          for(var a=0;a<arr.length;a++){
            if(arr[a].id == navData[j].funpid){
              arr[a].children.push({
                  id:navData[j].funid,
                  label:navData[j].funname,
                  children:[]
              })        
            }
          }
        }
        for(var b=0;b<navData.length;b++){
          for(var c=0;c<arr.length;c++){
             for(var d =0;d<arr[c].children.length;d++){
               if(arr[c].children[d].id == navData[b].funpid){
                 arr[c].children[d].children.push({
                   id:navData[b].funid,
                   label:navData[b].funname,
                   children:[]
                 })
               }
             }
          }
        }
        for(var e=0;e<navData.length;e++){
          for(var f=0;f<arr.length;f++){
             for(var g =0;g<arr[f].children.length;g++){
               for(var h =0;h<arr[f].children[g].children.length;h++){
                 if(arr[f].children[g].children[h].id ==navData[e].funpid){
                   arr[f].children[g].children[h].children.push({
                     id:navData[e].funid,
                     label:navData[e].funname,
                   })
                 }
               }
             }
          }
        }
        //console.log(arr)
        this.navData = arr;
    })
  },
  methods:{
    //选择框选中改变
    handleCheck(data,checked) {
      //console.log(checked)
      this.submitData = checked.checkedKeys;
      this.disabled = false;
    },
    //返回上一级
    goBack() {
      this.$router.go(-1);
    },
    //数据提交
    goSubmit(){
      let that = this;
      //构建提交数据
      let params = {
        roleid:this.roleid,
        funids:this.submitData.join()
      }
      //调用提交接口
      saveRight(params).then((res)=>{
        //console.log(res.data.code)
        if(res.data.code == 1){
            that.$message({
              message:"保存成功",
              type:"success",
            })
            that.$router.push("/role")
        }else{
            this.$message({
              message:"保存失败",
              type:"info"
            }); 
        }
      })
    }
  },
 }
</script>

<style scoped>
.query_btn{
  margin-top: 20px;
}
</style>